<template>
    <div>
        <div id="market-app" class="page-container">
            <div class="page-content">
                <div class="page-view">
                    <div class="assets-list">
                        <div class="btn-nav">
                            <div class="balances">
                                资产
                            </div>
                        </div>
                        <div class="content" id="products">
                            <div class="valuation-info">
                                <p class="val-name">估值 CNY</p>
                                <p class="val-pirce">
                                    ￥{{price_rmb}}
                                    <span class="transMoney">{{price_btc}}&nbsp;&nbsp;BTC</span>
                                </p>
                            </div>
                            <div class="assetPanel" @click="setDatalist()">
                                <i class="font font-funds"></i>
                                <span>
                                    <b>{{hideBtn}}</b>
                                </span>
                            </div>
                            <ul class="assetList">
                                <li v-for="(item, index) in actData" :class="{no_show: item.is_hidden}" :key="index">
                                    <router-link style="display:block;" :to="{ name: 'balances_detail', params: {coin_type: item.coin_type} }">
                                        <span>
                                            <img class="assetpic" :src="item.img" /> {{item.name_upper}}
                                            <span class="assetname">({{item.full_name}})</span>
                                        </span>
                                        <span class="f-fr">{{item.amount}}</span>
                                    </router-link>
                                </li>
                            </ul>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
  data() {
    return {
      smallAssets: true,
      hideBtn: "隐藏小额资产",
      actData: [],
      hide_small: false /* 判断小资产的标志位 */,
      price_btc: "" /* 估值BTC */,
      price_rmb: "" /* 估值￥ */
    };
  },
  methods: {
    to_details: function(coin_type) {
      // window.location.href = './assets-details.html#/market?symbol=BCC_USDT';
      window.location.href = "./balance_detail?coin_type=" + coin_type;
    },
    setDatalist: function() {
      this.smallAssets = !this.smallAssets;
      if (this.smallAssets == true) {
        this.hideBtn = "隐藏小额资产";
        /* 默认是显示全部的 */
        for (var i = 0; i < this.actData.length; i++) {
          this.actData[i].is_hidden = false;
        }
      } else {
        this.hideBtn = "显示全部";
        /* 循环判断，隐藏小资产 */
        for (var i = 0; i < this.actData.length; i++) {
          if (this.actData[i].amount < 0.00001) {
            //   console.log(789);
            this.actData[i].is_hidden = true;
          }
        }
      }
    },
    get_all_coin: function() {
      /* 发送请求，获取所有数据 */
      $.post("/btc/get_balances", {}, res => {
        // console.log(data[0]);
        var show_data = [];
        for (var i = 0; i < res.length; i++) {
          var item = res[i];
        //   console.log(item)
          var info = {};
          /* 图标类型 */
          var coin_info = get_coin_info(item.coin_type);
          // console.log(coin_info)
          /* 图标样式 */
          info.img = get_coin_icon_url(item.coin_type);
          // console.log("["+info.img+"]")
          info.coin_type = item.coin_type;
          info.amount = item.amount;
          info.name_upper = coin_info.name_upper;
          info.full_name = coin_info.cname;
          info.is_hidden = false;
          show_data.push(info);
        }
        this.actData = show_data;
        /* 获取估值部分 */
        this.get_coin_price();
      });
    },

    /* 获取估值部分 */
    get_coin_price: function() {
      $.post("/btc/get_coin_price", {}, res => {
        // console.log(res);

        for (var i = 0; i < this.actData.length; i++) {
          var p_coin_type = this.actData[i].coin_type;
          // console.log(p_coin_type);
          // console.log(res[p_coin_type]);
          if (res[p_coin_type]) {
            this.price_rmb += this.actData[i].amount * res[p_coin_type];
            this.price_rmb = parseInt(this.price_rmb);
            /* 保留八位小数 */
            this.price_btc = (this.price_rmb / res.btc).toFixed(8);
          }
        }
      });
    }
  },
  created() {
    this.get_all_coin();
  },
  components: {}
};
</script>

<style>
    .no_show{display: none;}
</style>
